<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>
<script>
    //发送一个ajax请求分4步

    //1、创建一个xhr对象
    let xhr = new XMLHttpRequest()

    //2、配置xhr对象
    //参数一：method请求方式 get / post / delete / put
    //参数二：url 请求地址（资源地址）
    xhr.open( 'get' , './data.json' )

    //3、设置回调函数，用来接收返回的响应数据
    //只要readystate的状态值发生改变，回调函数就会执行
    // 0 请求对象已创建，但是未初始化
    // 1 请求已配置，但是未发送
    // 2 请求已发送，但是服务器还未返回数据
    // 3 请求已发送，服务器已经在返回数据，但是数据可能没有全部返回
    // 4 请求已发送，数据已全部返回
    xhr.onreadystatechange = function(){

        if( xhr.readyState == 4 ){
            console.log('请求到了数据' , JSON.parse(xhr.responseText) );
        }
    }
    
    // 4、发送请求
    xhr.send()
</script>